<template>
	<view class="detail">
		<!-- 文章详情 -->
		<detailList :item="item"/>
		<!-- 评论页面 -->
		<view class="detail__comment" >
			<text class="detail__comment--title">最新评论 {{commentList.length}}</text>
			<comment  v-for="(item,index) in commentList" :key="item.id" :item="item"/>
		</view>
		<!-- 评论输入框 -->
		<userChatBottom @submit="submit"/>
		<!-- 分享 --> 
		<moreShare v-model:shareshow="shareshow" :shareddata="shareddata"/>
	</view>
</template>

<script setup>
	import {onBackPress,onLoad,onNavigationBarButtonTap} from '@dcloudio/uni-app';
	import detailList from '../../component/detail/derail-info.vue';
	import comment from '../../component/detail/comment.vue';
	import userChatBottom from '../../component/user-chat/user-chat-bottom.vue';
	import moreShare from '../../component/common/more-share.vue'
	import {getPostDetail} from '../../api/postApi.js'
	import {getCommentPage} from '../../api/commentApi.js';
	import {ref,reactive} from 'vue';
	
	const item = ref({})
	
	const commentList = ref([])
	
	const commentPage = ref(1)
	const shareshow= ref(false);
	const shareddata = reactive({
		title:"",
		content:"",
		url:"",
		titlepic:"",
		shareType:0,
		
	})
	
	function submit(val){
		console.log(val)
	}
	
	onLoad(async (e)=>{
		let id = e.id;
		let title = e.title;
		// 设置标题
		uni.setNavigationBarTitle({
			title,
		})
		item.value = await getPostDetail(id)
		console.log(item.value)
		getComment();
		__initShareData(e)
	})
	
	function __initShareData(obj){
		shareddata.shareType=0;
		shareddata.title=obj.title;
		shareddata.url="http://baidu.com";
		shareddata.titlepic = item.titlepic;
		shareddata.content = item.content;
	}
	
	// 获取评论数据分页
	function getComment(){
		getCommentPage(item.value.id,commentPage.value).then(res=>{
			commentList.value.push(...res)
			console.log(res)
		})
	}
	
	// 监听导航按钮事件
	onNavigationBarButtonTap((e)=>{
		if(e.index==0){
			shareshow.value = !shareshow.value;
		}
	})
</script>

<style scoped lang="scss">
	.detail {
		
		&__comment {
			padding: 10upx 20upx 140upx 20upx;
			&--title {
				font-size: 35upx;
				font-weight: bold;
				
			}
		}
	}
	
</style>
